<template>
    <!-- 标题 -->
    <div class="form-block">
        <label>标题</label>
        <input class="input-text" type="text" placeholder="标题" v-model="title" @keyup="saveSetting">
    </div>
</template>

<script>
import { mapState, mapMutations } from "vuex";
export default {
  data() {
    return {
      title: ""
    };
  },

  mounted() {
      this.title = this.setting[this.currSettingId].title;
  },

  computed: {
    ...mapState(["currSettingId", "setting"])
  },

  methods: {
    ...mapMutations(["SET_SETTING_INFO"]),

    saveSetting() {
      this.SET_SETTING_INFO({
        id: this.currSettingId,
        title: this.title
      });
    }
  },
  watch: {
    currSettingId() {
        this.title = this.setting[this.currSettingId].title;
    }
  }
};
</script>
